<template>
	<view class="ts-flex ts-column ts-flex-item">
		<ts-timeline>
			<ts-timeline-item>
				<block slot="time">
					<view>2018/9/29</view>
					<view>12:00</view>
				</block>
				<block slot="icon">
					<ts-icon type="camera" size="50"></ts-icon>
				</block>
				<block slot="content" class="ts-column">
					<view style="justify-content: space-between;">
						<view>发布第一个版本</view>
						<ts-badge text="0.01" type="danger"></ts-badge>
					</view>
					<view class="ts-h5">开发tsIcon、tsBadge、弹出广告、弹出窗口、抽屉菜单、分段导航等基础组件</view>
				</block>
			</ts-timeline-item>

			<ts-timeline-item>
				<block slot="time">
					<view>2018/9/30</view>
					<view>12:00</view>
				</block>
				<block slot="icon">
					<text>1</text>
				</block>
				<block slot="content" class="ts-column">
					<view style="justify-content: space-between;">
						<view>增加组件</view>
						<ts-badge text="0.02" type="danger"></ts-badge>
					</view>
					<view class="ts-h5">开发LoadMore组件、左侧导航组件</view>
				</block>
			</ts-timeline-item>

			<ts-timeline-item>
				<block slot="time">
					<view>2018/10/4</view>
					<view>12:00</view>
				</block>
				<block slot="icon">
					<text>1</text>
				</block>
				<block slot="content" class="ts-column">
					<view style="justify-content: space-between;">
						<view>增加组件</view>
						<ts-badge text="0.03" type="danger"></ts-badge>
					</view>
					<view class="ts-h5">增加时间线、评星、城市选择窗口等组件</view>
				</block>
			</ts-timeline-item>
      
			<ts-timeline-item isLastItem="true">
				<block slot="time">
					<view>2018/10/5</view>
					<view>12:00</view>
				</block>
				<block slot="icon">
					<image :src="iconPlus" mode="widthFix"></image>
				</block>
				<block slot="content" class="ts-column">
					<view style="justify-content: space-between;">
						<view>后续开发</view>
						<ts-feedback-star score="4" activeColor="#FFB400"></ts-feedback-star>
					</view>
					<view class="ts-h5">开发更多的组件...</view>
				</block>
			</ts-timeline-item>

		</ts-timeline>
	</view>
</template>

<script>
	import tsIcon from '@/components/teaset/components/ts-icon.vue'
	import tsTimeline from '@/components/teaset/components/ts-timeline.vue';
	import tsTimelineItem from '@/components/teaset/components/ts-timeline-item.vue';
	import tsBadge from "@/components/teaset/components/ts-badge.vue";
	import tsFeedbackStar from '@/components/teaset/components/ts-feedback-star.vue'

	export default {
		components: {
			tsBadge,
			tsIcon,
			tsTimelineItem,
			tsTimeline,
			tsFeedbackStar
		},
		data(){ return  {
			iconPlus: '',

		}}
	}
</script>

<style>

</style>
